<template>
  <div class="divBox">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <div class="container">
          <el-row type="flex" class="row-bg" justify="space-between">
            <el-col :span="22">
              <el-input
                v-model="listPram.title"
                placeholder="请输入名称"
                clearable
                size="small"
                style="width: 400px;"
              >
                <el-button
                  slot="append"
                  icon="el-icon-search"
                  size="small"
                  @click="handlerSearch"
                />
              </el-input>
              <el-select
                v-model="listPram.status"
                clearable
                placeholder="请选择状态"
                @change="handlerSearch"
              >
                <el-option
                  v-for="item in constants.choujiangStatusList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
              <!-- <el-select
                v-model="listPram.status"
                clearable
                placeholder="请选择商家"
                @change="handlerSearch"
              >
                <el-option
                  v-for="item in constants.choujiangStatusList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select> -->
            </el-col>
            <el-col :span="2">
              <el-button class="text-right" type="primary" @click="addChoujiang"
                >添加抽奖</el-button
              >
            </el-col>
            <el-col :span="6">
              <el-button
                class="text-right"
                type="primary"
                @click="batchVisiable = true"
                >开发批量添加抽奖</el-button
              >
              <el-button
              type="primary"
              @click="updateChoujiangFn2()"
              >开发批量通过</el-button
            >
            </el-col>
          </el-row>
        </div>
      </div>
      <el-table :data="listData.list" style="width: 100%" v-loading="loading">
        <el-table-column prop="title" label="名称"> </el-table-column>
        <el-table-column prop="image" label="名称"> </el-table-column>
        <el-table-column prop="openTime" label="开奖时间"> </el-table-column>
        <el-table-column prop="type">
          <template slot-scope="scope">
            <el-tag :type="scope.row.autoOpen ? 'success' : 'danger'">{{
              scope.row.autoOpen ? "自动抽奖" : "手动抽奖"
            }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="openMinutes" label="开奖时长"> </el-table-column>
        <el-table-column prop="createTime" label="创建时间"> </el-table-column>
        <el-table-column prop="maxPeople" label="最多" width="50">
        </el-table-column>
        <el-table-column
          prop="minPeople"
          label="最少"
          width="50"
        ></el-table-column>
        <el-table-column
          prop="recordCount"
          label="参与"
          width="50"
        ></el-table-column>
        <!--- 0-审核中 1-待开奖 2-开奖中 3-已结束 4-已取消   --->
        <el-table-column prop="type" label="状态" width="80">
          <template slot-scope="scope">
            <div>
              {{
                scope.row.status == 0
                  ? "审核中"
                  : scope.row.status == 1
                  ? "待开奖"
                  : scope.row.status == 2
                  ? "开奖中"
                  : scope.row.status == 3
                  ? "已结束"
                  : "已取消"
              }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="type" label="抽奖类型">
          <template slot-scope="scope">
            <el-tag :type="scope.row.type == 1 ? 'success' : 'danger'">{{
              scope.row.type == 1 ? "普通抽奖" : "红包抽奖"
            }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="260">
          <template slot-scope="scope">
            <el-button
              v-if="scope.row.status == 0"
              type="primary"
              @click="editChoujiang(scope.row)"
              size="mini"
              >编辑</el-button
            >
            <el-button
              v-if="scope.row.status == 0"
              type="primary"
              @click="editAmount(scope.row)"
              size="mini"
              >编辑数量</el-button
            >
            <el-button
              v-if="scope.row.status == 0"
              type="success"
              @click="updateChoujiangFn(scope.row)"
              size="mini"
              >通过</el-button
            >
           
            <el-button
              v-if="
                new Date().getTime() > new Date(scope.row.openTime).getTime() &&
                  scope.row.status == 0
              "
              type="warning"
              @click="cancelChoujiangFn(scope.row)"
              size="mini"
              >取消</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        :current-page="listPram.page"
        :page-sizes="constants.page.limit"
        :layout="constants.page.layout"
        :total="listData.total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </el-card>
    <el-dialog
      :title="editDialogConfig.title"
      :visible.sync="editDialogConfig.visible"
    >
      <el-form
        :model="ruleForm"
        ref="ruleForm"
        label-width="150px"
        class="demo-ruleForm"
        @submit.native.prevent
      >
        <el-form-item label="名称：">
          <el-input
            v-model="ruleForm.title"
            maxlength="40"
            placeholder="请输入名称"
            class="dialogWidth"
          ></el-input>
        </el-form-item>
         <el-form-item label="奖品图片：">
          <div class="upLoadPicBox" @click="modalPicTap('award')">
            <div class="pictrue" v-if="ruleForm.image">
              <img :src="ruleForm.image" />
            </div>
            <div v-else class="upLoad">
              <i class="el-icon-camera cameraIconfont" />
            </div>
          </div>
        </el-form-item>
        <el-form-item label="说明：">
          <el-input
            v-model="ruleForm.description"
            maxlength="100"
            placeholder="请输入说明"
            class="dialogWidth"
          ></el-input>
        </el-form-item>
        <el-form-item label="关联商家">
          <el-select
            v-model="ruleForm.relateId"
            placeholder="请选择"
            class="selWidth"
          >
            <el-option
              :label="item.name"
              :value="item.id"
              v-for="(item, index) in relateList"
              :key="index"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="自动开奖">
          <el-switch
                    v-model="ruleForm.autoOpen"
                    :active-value="true"
                    :inactive-value="false"
                    active-text="自动开奖"
                    inactive-text="手动开奖"
                    @change="onchangeIsShow(scope.row)"
                  />
        </el-form-item>
        <el-form-item label="抽奖类型">
          <el-select
            v-model="ruleForm.type"
            placeholder="请选择"
            @change="typeChange"
          >
            <el-option
              :label="item.name"
              :value="item.id"
              v-for="(item, index) in constants.choujiangTypeList"
              :key="index"
            ></el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="抽奖排序：">
          <el-input
            v-model.number="ruleForm.sort"
            placeholder="请输入"
            class="dialogWidth"
          ></el-input>
        </el-form-item> -->
        <el-form-item label="消耗抽奖次数：">
          <el-input
            v-model.number="ruleForm.drawNumber"
            placeholder="请输入"
            class="dialogWidth"
          ></el-input>
        </el-form-item>
        <el-form-item label="开奖时间:" prop="time">
          <el-date-picker
            v-model="ruleForm.openTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            format="yyyy-MM-dd HH:mm:ss"
            size="small"
            placement="bottom-end"
            placeholder="自定义时间"
            style="width: 250px;"
          />
        </el-form-item>
        <el-form-item label="开奖时长">
          <el-select
            v-model="ruleForm.openMinutes"
            placeholder="状态"
            class="selWidth"
          >
            <el-option label="5分钟" :value="5"></el-option>
            <el-option label="10分钟" :value="10"></el-option>
            <el-option label="15分钟" :value="15"></el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="最多参与：">
          <el-input
            v-model.number="ruleForm.maxPeople"
            class="dialogWidth"
          ></el-input>
        </el-form-item> -->
        <el-form-item label="最少参与：">
          <el-input
            v-model.number="ruleForm.minPeople"
            class="dialogWidth"
          ></el-input>
        </el-form-item>
        <el-form-item v-if="ruleForm.type == 2" label="红包金额：">
          <el-input
            v-model.number="ruleForm.money"
            class="dialogWidth"
          ></el-input>
        </el-form-item>
        <el-card class="box-card" v-if="ruleForm.type == 1">
          <div class="clearfix" slot="header">
            <span>奖品设置</span>
            <el-button
              style="float: right; padding: 3px 0"
              type="text"
              @click="addChoujiang"
              >添加</el-button
            >
          </div>
          <div
            v-for="(item, index) in ruleForm.prizes"
            :key="index"
            class="bghui"
          >
            <i class="el-icon-delete deleanswer" @click="delAward(index)"></i>
            <div class="question_main">
              <el-form label-width="100px" inline>
                <el-form-item label="奖品名称">
                  <el-input
                    placeholder="请输入名称"
                    v-model="item.title"
                  ></el-input>
                </el-form-item>
                <!-- <el-form-item label="奖品图片：">
                  <div class="upLoadPicBox" @click="modalPicTap(index)">
                    <div class="pictrue" v-if="item.imageUrl">
                      <img :src="item.imageUrl" />
                    </div>
                    <div v-else class="upLoad">
                      <i class="el-icon-camera cameraIconfont" />
                    </div>
                  </div>
                </el-form-item> -->
                <el-form-item label="数量">
                  <el-input
                    type="text"
                    placeholder="请输入奖品数量"
                    v-model="item.count"
                  ></el-input>
                </el-form-item>
                <!-- <el-form-item label="过期时间">
                  <el-date-picker
                    v-model="item.endTime"
                    type="datetime"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    format="yyyy-MM-dd HH:mm:ss"
                    size="small"
                    placement="bottom-end"
                    placeholder="自定义时间"
                    style="width: 250px;"
                  />
                </el-form-item> -->
                <el-form-item label="奖品类型">
                  <el-select
                    v-model="item.prizeType"
                    clearable
                    placeholder="请选择类型"
                  >
                    <el-option
                      v-for="item in prizeTypeList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                    </el-option> </el-select
                ></el-form-item>
                <el-form-item v-if="item.prizeType == 2">
                  <el-select
                    v-model="item.relateId"
                    clearable
                    placeholder="请选择优惠券"
                  >
                    <el-option
                      v-for="item in couponList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item v-if="item.prizeType == 4">
                  <el-input
                    placeholder="请输入红包金额"
                    v-model.number="ele.money"
                    style="width: 160px"
                  ></el-input>
                </el-form-item>

                <el-form-item label="兑换方式">
                  <el-select
                    v-model="item.receiveType"
                    clearable
                    placeholder="请选择类型"
                  >
                    <el-option
                      v-for="item in duijiangTypeList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                    </el-option> </el-select
                ></el-form-item>

                <el-form-item label="幸运规则">
                  <el-select
                    v-model="item.matchType"
                    clearable
                    placeholder="请选择类型"
                  >
                    <el-option
                      v-for="item in matchList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="幸运数字">
                  <el-input
                    type="text"
                    placeholder="请输入幸运数字"
                    v-model="item.matchNumber"
                  ></el-input>
                </el-form-item>
                <el-card v-if="roles == 1 && index ==0">
                  <div class="clearfix" slot="header">
                    <el-button
                      style="float: right; padding: 3px 0"
                      type="text"
                      @click="addUser(item)"
                      >添加幸运人</el-button
                    >
                  </div>
                  <div v-if="item.matchUid && item.matchUid.length > 0">{{item.matchUid[0].uid}}</div>
                  <!-- <div
                    label="幸运人"
                    v-for="(ele, idx) in item.matchUid"
                    :key="idx"
                    style="width: 100%;position: relative"
                  >
                    <i
                      class="el-icon-delete deleanswer"
                      @click="delUser(index)"
                    ></i>
                    <el-select
                      v-model="ele.uid"
                      clearable
                      placeholder="请选择幸运人"
                    >
                      <el-option
                        v-for="item in userList"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      >
                      </el-option>
                    </el-select>
                    <el-input
                      type="text"
                      placeholder="请输入数量"
                      v-model="ele.count"
                      style="width: 160px"
                    ></el-input>
                  </div> -->
                </el-card>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button
          type="primary"
          @click="editForm('ruleForm')"
          v-if="editDialogConfig.isEdit == 1"
          >修改</el-button
        >
        <el-button type="primary" @click="submitForm('ruleForm')" v-else
          >提交</el-button
        >
      </div>
    </el-dialog>
    <el-dialog title="编辑数量" :visible.sync="amountVisible">
      <el-input v-model="amount"></el-input>
      <div slot="footer" class="dialog-footer">
        <el-button @click="amountVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitAmount()">提交</el-button>
      </div>
    </el-dialog>
    <el-dialog title="编辑中奖人" :visible.sync="uidVisible">
      <el-input v-model="user_id" placeholder="中奖人uid"></el-input>
      <div slot="footer" class="dialog-footer">
        <el-button @click="uidVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitUid()">提交</el-button>
      </div>
    </el-dialog>
    <el-dialog title="批量添加抽奖" :visible.sync="batchVisiable">
      <el-form label-width="150px"
        class="demo-ruleForm">
        <el-form-item label="名称">
          <el-input v-model="batchObj.name" placeholder="使用,分割"></el-input>
        </el-form-item>
        <el-form-item label="图片">
          <el-input v-model="batchObj.image" placeholder="使用,分割"></el-input>
        </el-form-item>
        <el-form-item label="开奖时长">
          <el-input
            v-model="batchObj.openMinutes"
            placeholder="开奖时长"
          ></el-input>
        </el-form-item>
        <el-form-item label="开奖时间">
          <el-date-picker
            v-model="batchObj.openDay"
            type="date"
            value-format="yyyy-MM-dd"
            format="yyyy-MM-dd"
            size="small"
            placement="bottom-end"
            placeholder="自定义时间"
            style="width: 250px;"
          />
        </el-form-item>
        <!-- <el-form-item label="最多参与">
          <el-input
            v-model="batchObj.maxPeople"
            placeholder="最多参与"
          ></el-input>
        </el-form-item> -->
        <el-form-item label="最少参与">
          <el-input
            v-model="batchObj.minPeople"
            placeholder="最少参与"
          ></el-input>
        </el-form-item>
        <el-form-item label="抽奖次数">
          <el-input
            v-model="batchObj.drawNumber"
            placeholder="抽奖次数"
          ></el-input>
        </el-form-item>
        <el-form-item label="人数倍数">
          <el-input v-model="batchObj.amount" placeholder="人数倍数"></el-input>
        </el-form-item>
        <el-form-item label="关联商家">
          <el-select
            v-model="batchObj.relateId"
            placeholder="请选择"
            class="selWidth"
          >
            <el-option
              :label="item.name"
              :value="item.id"
              v-for="(item, index) in relateList"
              :key="index"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="batchVisiable = false">取 消</el-button>
        <el-button type="primary" @click="batchAdd()">提交</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  updateChoujiang,
  addChoujiang,
  getChoujiangList,
  delChoujiang,
  choujiangInfo,
  getMerchantAll
} from "@/api/choujiang";
import Templates from "@/views/appSetting/wxAccount/wxTemplate/index";
import { Debounce } from "@/utils/validate";
import { mapGetters } from "vuex";
import dayjs from "dayjs";
const desPrize =
  "抽奖奖品物流实物中奖后提交收货地址兑奖；自提实物中奖上门核销兑奖；进度查询可进入商家详情界面添加商家微信或者联系客服；截止兑奖时间过后未兑奖视为放弃奖品";
export default {
  name: "ChoujiangList",
  components: { Templates },
  computed: {
    ...mapGetters(["roles"])
  },
  data() {
    return {
      constants: this.$constants,
      listPram: {
        name: null,
        status: 1,
        page: 1,
        limit: this.$constants.page.limit[0]
      },
      user_id: '',
      uidVisible: false,
      uidItem: {},
      editDialogConfig: {
        visible: false,
        title: "添加抽奖",
        isEdit: 0 // 0=add 1=edit
      },
      relateList: [
        {
          name: "平台",
          id: -1
        }
      ],
      batchVisiable: false,
      // 周天晚上编辑 下周天
      batchObj: {
        name: "",
        image: '',
        minute: 5,
        amount: 5,
        autoOpen: true,
        relateId: "",
        openDay: "",
        openMinutes: 5,
        drawNumber: 1,
        description: desPrize,
        minPeople: null
      },
      amountVisible: false,
      amountObj: {},
      amount: 5,
      loading: true,
      listData: { list: [], total: 0 },
      ruleForm: {
        title: "",
        description: desPrize,
        relateId: null,
        autoOpen: false,
        type: null,
        drawNumber: 1,
        openTime: "",
        openMinutes: 5,
        minPeople: null,
        money: null,
        prizes: [
          {
            // 15积分   // 严格按照【数字+积分】
            title: "",
            prizeType: null,
            receiveType: null,
            count: null,
            endTime: "",
            matchNumber: null,
            matchType: null,
            matchUid: []
          }
        ]
      },
      userList: [],
      prizeTypeList: this.$constants.prizeTypeList,
      duijiangTypeList: this.$constants.duijiangTypeList,
      matchList: [
        {
          name: "匹配",
          id: 1
        },
        {
          name: "整除",
          id: 2
        },
        {
          name: "无规则",
          id: 0
        }
      ],
      point_visible: false
    };
  },
  created() {},
  mounted() {
    // 获取所有商家
    this.getMerchantAllFn();
    this.getChoujiangListFn();
  },
  methods: {
    cancelChoujiangFn(row) {
      let that = this;
      that.$modalSure("确定要取消该抽奖吗？").then(() => {
        row.cancelRemark = "平台取消";
        row.status = 4;
        updateChoujiang(row).then(() => {
          that.$message.success("取消成功");
          that.getChoujiangListFn();
        });
      });
    },
    updateChoujiangFn(row) {
      let that = this;
      if (new Date(row.openTime).getTime() < new Date().getTime()) {
        return this.$message.warning("开奖时间不能小于现在时间");
      }
      that.$modalSure("确定要通过该抽奖吗？").then(() => {
        if (row.type == 2) {
          row.drawNumber = 9
        }
        row.status = 1;
        updateChoujiang(row).then(() => {
          that.$message.success("成功");
          that.getChoujiangListFn();
        });
      });
    },
    updateChoujiangFn2() {
      for (let i =0; i < this.listData.list.length;i++) {
        let item = this.listData.list[i]
        if (item.relateId == 20) {
          item.status = 1
          updateChoujiang(item)
        }
      }
    },
    goChoujiangFn(row) {
      let that = this;
      that.$modalSure("确定要待开奖转开奖中吗？").then(() => {
        row.status = 2;
        updateChoujiang(row).then(() => {
          that.$message.success("成功");
          that.getChoujiangListFn();
        });
      });
    },
    // 普通抽奖补充积分奖项
    addOtherPoint() {
      let count = this.ruleForm.prizes.length;
      let arr = [];
      for (let i = 0; i < 8 - count; i++) {
        arr.push({
          title: parseInt(Math.random() * 100) + "积分",
          prizeType: 3
        });
      }
      this.ruleForm.prizes = this.ruleForm.prizes.concat(arr);
    },
    typeChange(val) {
      this.ruleForm.money = null;
      this.ruleForm.prizes = [
        {
          // 15积分   // 严格按照【数字+积分】
          title: "",
          prizeType: null,
          receiveType: null,
          relateId: null,
          count: null,
          endTime: "",
          matchNumber: null,
          matchType: null,
          matchUid: []
        }
      ];
    },
    getMerchantAllFn() {
      getMerchantAll().then(res => {
        this.relateList = this.relateList.concat(res);
      });
    },
    delAward(index) {
      this.ruleForm.prizes.splice(index, 1);
    },
    addChoujiang() {
      this.ruleForm.prizes.push({
        // 15积分   // 严格按照【数字+积分】
        title: "",
        prizeType: null,
        receiveType: null,
        relateId: null,
        imageUrl: "",
        count: null,
        endTime: "",
        matchNumber: null,
        matchType: null,
        matchUid: []
      });
    },
    addUser(item) {
      this.uidVisible = true
      this.uidItem = item
    },
    delUser(index) {
      item.matchUid.splice(index, 1);
    },
    handleDelete(item) {
      let that = this;
      that.$modalSure("确定要删除该抽奖吗？").then(() => {
        delChoujiang(item.id).then(() => {
          that.$message.success("删除成功");
          that.getChoujiangListFn();
        });
      });
    },
    addChoujiang() {
      this.editDialogConfig.title = "添加抽奖";
      this.editDialogConfig.visible = true;
    },
    editAmount(item) {
      // 改变数量  5*7+ 1  6*7 + 1  7*7 + 1  8*7 +1 9*7+1
      this.amountVisible = true;
      this.amountObj = JSON.parse(JSON.stringify(item));
    },
    submitUid() {
      this.uidItem.matchUid = [
      {
        uid: this.user_id,
        maxCount: 1
      }
      ]
      this.uidVisible = false
    },
    submitAmount() {
      if (!this.amount) {
        return this.$message.error("amount不能为空");
      }
      this.amountObj.maxPeople = parseInt(this.amount) * 7 + 1
      for (let i = 0; i < this.amountObj.prizes.length; i++) {
        if (this.amountObj.prizes[i].prizeType == 3) {
          this.amountObj.prizes[i].count = parseInt(this.amount);
        }
      }
      console.log(this.amountObj.prizes, "prizesprizesprizes--");
      updateChoujiang(this.amountObj).then(() => {
        this.$message.success("编辑成功");
        this.amountVisible = false;
        this.amount = 5;
      });
    },
    async editChoujiang(item) {
      this.editDialogConfig.title = "编辑抽奖";
      this.editDialogConfig.visible = true;
      this.editDialogConfig.isEdit = 1;
      this.ruleForm = await choujiangInfo(item.id);
      if (!this.ruleForm.drawNumber) {
        this.ruleForm.drawNumber = 1;
      }
    },
    getChoujiangListFn() {
      this.loading = true;
      getChoujiangList(this.listPram).then(res => {
        this.listData = res;
        this.loading = false;
      });
    },
    async batchAdd() {
      // 先把json打印出来看看
      let arr = this.batchObj.name.split(",");
      let imgArr = this.batchObj.image.split(",");
      let submitArr = [];
      for (let k = 0; k < arr.length; k++) {
        let obj = {
          title: arr[k],
          image: imgArr[k],
          description: desPrize,
          relateId: this.batchObj.relateId,
          type: 1,
          autoOpen: this.batchObj.autoOpen,
          maxPeople: this.batchObj.amount * 7 + 1,
          minPeople: this.batchObj.minPeople,
          drawNumber: this.batchObj.drawNumber,
          openMinutes: this.batchObj.openMinutes,
          openTime: "2024-01-19 20:10:00",
          // openTime: dayjs(this.batchObj.openDay)
          //   .add(k * this.batchObj.openMinutes, "minute").add(20, 'hour')
          //   .format("YYYY-MM-DD HH:mm:ss"),
          prizes: []
        };
        obj.prizes.push({
          title: arr[k],
          prizeType: 1,
          receiveType: 2,
          count: 1,
          endTime:
            dayjs(obj.openTime)
              .add(6, "day")
              .format("YYYY-MM-DD") + " 23:59:59"
        });
        for (let i = 0; i < 7; i++) {
          let random = Math.floor(Math.random() * 100) + 1;
          let amount = {
            title: random + "积分",
            integral: random,
            prizeType: 3,
            prizeTypeLabel: "积分",
            count: this.batchObj.amount
          };
          obj.prizes.push(amount);
        }
        submitArr.push(obj);
      }
      console.log(submitArr, "submitArr----");
      this.$message.success('提交成功')
      this.batchVisiable = false
      for(let u = 0; u< submitArr.length;u++) {
        await addChoujiang(submitArr[u])
      }
    },
    submitForm: Debounce(function(name) {
      for (let j = 0; j < this.ruleForm.prizes.length; j++) {
        if (this.ruleForm.prizes[j].prizeType == 1) {
          // 实物 截止兑奖时间 往后延期7天
          this.ruleForm.prizes[j].endTime =
            dayjs(this.ruleForm.prizes[j].openTime)
              .add(6, "day")
              .format("YYYY-MM-DD") + " 23:59:59";
        }
      }
      this.ruleForm.maxPeople = 36
      if (8 - this.ruleForm.prizes.length > 0) {
        let arr = [];
        for (let i = 0; i < 8 - this.ruleForm.prizes.length; i++) {
          let random = Math.floor(Math.random() * 50) + 1;
          let obj = {
            title: random + "积分",
            integral: random,
            prizeType: 3,
            prizeTypeLabel: "积分",
            count: 5
          };
          arr.push(obj);
        }
        this.ruleForm.prizes = this.ruleForm.prizes.concat(arr);
      }
      addChoujiang(this.ruleForm).then(async () => {
        this.$message.success("提交成功");
        this.editDialogConfig.visible = false;
        this.getChoujiangListFn();
      });
    }),
    //编辑
    editForm: Debounce(function(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          updateChoujiang(this.ruleForm).then(async () => {
            this.$message.success("编辑成功");
            this.editDialogConfig.visible = false;
            this.getChoujiangListFn();
          });
        } else {
          return false;
        }
      });
    }),
    cancel() {
      this.editDialogConfig.visible = false;
      this.ruleForm.image = "";
      this.openTime = ["", ""];
    },
    //上传图片
    modalPicTap(index) {
      const _this = this;
      this.$modalUpload(
        function(img) {
          console.log(img, "img---");
          if (index == "award") {
            _this.ruleForm.image = img[0].sattDir;
          } else {
            _this.ruleForm.prizes[index].imageUrl = img[0].sattDir;
          }
        },
        index + "",
        "system"
      );
    },
    handlerSearch() {
      this.listPram.page = 1;
      this.getChoujiangListFn(this.listPram);
    },
    handleSizeChange(val) {
      this.listPram.limit = val;
      this.getChoujiangListFn(this.listPram);
    },
    handleCurrentChange(val) {
      this.listPram.page = val;
      this.getChoujiangListFn(this.listPram);
    }
  }
};
</script>

<style scoped lang="scss">
.el-input-group__append,
.el-input-group__prepend {
  background-color: #1890ff !important;
  color: #fff !important;
  border-color: #1890ff !important;
  border-radius: 0 4px 4px 0;
}
.cascaderW {
  width: 350px;
}
.mapBox {
  text-align: center;
}
.sub {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.question {
  width: 80%;
  .line {
    text-align: center;
  }
  .red {
    color: #ff0000;
  }
}
.bghui {
  background: #fafafa;
  width: 100%;
  position: relative;
  margin-bottom: 20px;
  .deleanswer {
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
    height: 40px;

    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    color: #fff;
    background: #ff0000;
    padding-left: 10px;
    border-radius: 40px 0 0 100px;
  }
  .answer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 20px;
  }
  .ifsuccess {
    width: 100px;
    height: 36px;
    background: #bababa;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .successicon {
    background: green;
    color: #fff;
  }
}
.red {
  color: red !important;
}
.question_main {
  padding: 10px;
}
</style>
